﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <title>CRON Expression</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <link rel="stylesheet" href="~/Content/croneditor/styles.css">
    <style type="text/css">
        .modal-dialog {
            width: 800px;
            height: 560px;
        }
    </style>
</head>
<body>
    <!-- Modal -->
    <div class="modal-body" style="height:460px;">
        <section class="container1">
            <div class="one">
                <div class="row">
                    <div class="panel-body cronExpressionBodyFix">
                        <div class="well well-sm cronExpressionWell">
                            <div id="cronExpressionValue" class="cronExpressionText">0 0 12 1/1 * ? *</div>
                        </div>
                        <div style="display:inline-block;padding:5px">
                            <button id="editButton" type="button" class="btn btn-default editCronTextBtn" data-toggle="tooltip" title="Edit expression manually" data-target="#myModal">
                                <span class="glyphicon glyphicon-edit" aria-hidden="true"></span>
                            </button>
                            <button type="button" id="copyButton" class="btn btn-default editCronTextBtn" title="Copy to clipboard" data-toggle="tooltip">
                                <span class="glyphicon glyphicon-copy" aria-hidden="true"></span>
                            </button>
                            <button type="button" id="resetButton" class="btn btn-default editCronTextBtn" title="Reset to default" data-toggle="tooltip">
                                <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>
                            </button>
                        </div>
                    </div>
                </div>
                <!-- Nav tabs -->
                <ul class="nav nav-tabs" role="tablist">
                    <li class="active"><a href="#minute" role="tab" data-toggle="tab" class="lang" as="minute"></a></li>
                    <li><a href="#hour" role="tab" data-toggle="tab" class="lang" as="hour"></a></li>
                    <li><a href="#dayofmonth" role="tab" data-toggle="tab" class="lang" as="daymonth"></a></li>
                    <li><a href="#month" role="tab" data-toggle="tab" class="lang" as="month"></a></li>
                    <li><a href="#dayofweek" role="tab" data-toggle="tab" class="lang" as="dayweek"></a></li>
                </ul>

                <!-- Tab panes -->
                <div class="tab-content panel-body">
                    <div class="tab-pane active" id="minute">
                        <div class="panel panel-default">
                            <div id="accordionheader2" class="panel-heading accordionEl inactiveAccordion" data-toggle="collapse" data-parent="#accordion" href="#collapse2">
                                <div class="panel-title accordionElTitle"><span class="glyphicon glyphicon-triangle-bottom glyphiconAccordion" aria-hidden="true"></span>
                                    <span class="lang" as="minute"></span><div id="content_minutes" class="accordionElContent">[ * ]</div></div>
                            </div>
                            <div id="collapse2" class="panel-collapse collapse">
                                <div class="tabbable-panel">
                                    <div class="tabbable-line">
                                        <ul class="nav nav-tabs">
                                            <li class="active"><a id="tabEvery_minutes" data-toggle="tab" href="#everyMinute"><span class="lang" as="everymintue"></span> <span class="glyphicon glyphicon-asterisk glyphiconTab" aria-hidden="true"></span></a></li>
                                            <li><a id="tabEach_minutes" data-toggle="tab" href="#eachMinute" class="lang" as="everynminute"></a></li>
                                            <li><a id="tabSelected_minutes" data-toggle="tab" href="#selectedMinutes" class="lang" as="selectminute"></a></li>
                                        </ul>
                                        <div class="tab-content">
                                            <div id="everyMinute" class="tab-pane fade in active">
                                                <div class="settingsContainer text-center">
                                                    <div id="minutesText1" class="well well-sm settingsText">*</div>
                                                    <button id="everyUnit_minutes" type="button" class="btn btn-default btn-success lang" style="width:100%;" as="everyminute"></button>
                                                </div>
                                            </div>
                                            <div id="eachMinute" class="tab-pane fade">
                                                <div class="settingsContainer text-center">
                                                    <div id="minutesText2" class="well well-sm settingsText">0</div>
                                                    <input id="eachUnit_minutes" class="topcoat-range-input" type="range" min="0" max="59" step="1" value="0">
                                                </div>
                                            </div>
                                            <div id="selectedMinutes" class="tab-pane fade">
                                                <div class="settingsContainer">
                                                    <div id="minutesText3" class="well well-sm settingsText">12,13,15,48</div>
                                                    <div id="selectMinutes"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane" id="hour">
                        <div class="panel panel-default">
                            <div id="accordionheader3" class="panel-heading accordionEl inactiveAccordion" data-toggle="collapse" data-parent="#accordion" href="#collapse3">
                                <div class="panel-title accordionElTitle"><span class="glyphicon glyphicon-triangle-right glyphiconAccordion" aria-hidden="true"></span>
                                <span class="lang" as="hour"></span><div id="content_hours" class="accordionElContent">[ * ]</div></div>
                            </div>
                            <div id="collapse3" class="panel-collapse collapse">
                                <div class="tabbable-panel">
                                    <div class="tabbable-line">
                                        <ul class="nav nav-tabs">
                                            <li class="active"><a id="tabEvery_hours" data-toggle="tab" href="#everyHour" class="lang" as="everyhour"></a></li>
                                            <li><a id="tabEach_hours" data-toggle="tab" href="#eachHour" class="lang" as="everynhour"></a></li>
                                            <li><a id="tabSelected_hours" data-toggle="tab" href="#selectedHours" class="lang" as="selecthour"></a></li>
                                        </ul>
                                        <div class="tab-content">
                                            <div id="everyHour" class="tab-pane fade in active">
                                                <div class="settingsContainer text-center">
                                                    <div id="hoursText1" class="well well-sm settingsText">*</div>
                                                    <button id="everyUnit_hours" type="button" class="btn btn-default btn-success lang" style="width:100%;" as="everyhour">每小时</button>
                                                </div>
                                            </div>
                                            <div id="eachHour" class="tab-pane fade">
                                                <div class="settingsContainer text-center">
                                                    <div id="hoursText2" class="well well-sm settingsText">0</div>
                                                    <input id="eachUnit_hours" class="topcoat-range-input" type="range" min="0" max="23" step="1" value="0">
                                                </div>
                                            </div>
                                            <div id="selectedHours" class="tab-pane fade">
                                                <div class="settingsContainer">
                                                    <div id="hoursText3" class="well well-sm settingsText">12,13,15,48</div>
                                                    <div id="selectHours"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane" id="dayofmonth">
                        <div class="panel panel-default">
                            <div id="accordionheader4" class="panel-heading accordionEl inactiveAccordion" data-toggle="collapse" data-parent="#accordion" href="#collapse4">
                                <div class="panel-title accordionElTitle"><span class="glyphicon glyphicon-triangle-right glyphiconAccordion" aria-hidden="true"></span>
                                <span class="lang" as="daymonth"></span><div id="content_daysOfMonth" class="accordionElContent">[ * ]</div></div>
                            </div>
                            <div id="collapse4" class="panel-collapse collapse">
                                <div class="tabbable-panel">
                                    <div class="tabbable-line">
                                        <ul class="nav nav-tabs">
                                            <li class="active"><a id="tabEvery_daysOfMonth" data-toggle="tab" href="#everyDay" class="lang" as="everyday"></a></li>
                                            <li><a id="tabSelected_daysOfMonth" data-toggle="tab" href="#selectedDays" class="lang" as="selectday"></a></li>
                                        </ul>
                                        <div class="tab-content">
                                            <div id="everyDay" class="tab-pane fade in active">
                                                <div class="settingsContainer text-center">
                                                    <div id="daysOfMonthText1" class="well well-sm settingsText">*</div>
                                                    <button id="everyUnit_daysOfMonth" type="button" class="btn btn-default btn-success lang" style="width:100%;" as="everyday"></button>
                                                </div>
                                            </div>
                                            <div id="selectedDays" class="tab-pane fade">
                                                <div class="settingsContainer">
                                                    <div id="daysOfMonthText3" class="well well-sm settingsText">12,13,15,48</div>
                                                    <div id="selectDays"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane" id="month">
                        <div class="panel panel-default">
                            <div id="accordionheader5" class="panel-heading accordionEl inactiveAccordion" data-toggle="collapse" data-parent="#accordion" href="#collapse5">
                                <div class="panel-title accordionElTitle"><span class="glyphicon glyphicon-triangle-right glyphiconAccordion" aria-hidden="true"></span>
                                <span class="lang" as="month"></span><div id="content_months" class="accordionElContent">[ * ]</div></div>
                            </div>
                            <div id="collapse5" class="panel-collapse collapse">
                                <div class="tabbable-panel">
                                    <div class="tabbable-line">
                                        <ul class="nav nav-tabs">
                                            <li class="active"><a id="tabEvery_months" data-toggle="tab" href="#everyMonth" class="lang" as="everymonth"></a></li>
                                            <li><a id="tabSelected_months" data-toggle="tab" href="#selectedMonths" class="lang" as="selectmonth"></a></li>
                                        </ul>
                                        <div class="tab-content">
                                            <div id="everyMonth" class="tab-pane fade in active">
                                                <div class="settingsContainer text-center">
                                                    <div id="monthsText1" class="well well-sm settingsText">*</div>
                                                    <button id="everyUnit_months" type="button" class="btn btn-default btn-success lang" style="width:100%;" as="everymonth"></button>
                                                </div>
                                            </div>
                                            <div id="selectedMonths" class="tab-pane fade">
                                                <div class="settingsContainer">
                                                    <div id="monthsText3" class="well well-sm settingsText">12,13,15,48</div>
                                                    <div id="selectMonths"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane" id="dayofweek">
                        <div class="panel panel-default">
                            <div id="accordionheader6" class="panel-heading accordionEl inactiveAccordion" data-toggle="collapse" data-parent="#accordion" href="#collapse6">
                                <div class="panel-title accordionElTitle"><span class="glyphicon glyphicon-triangle-right glyphiconAccordion" aria-hidden="true"></span>
                                <span class="lang" as="dayweek"></span><div id="content_daysOfWeek" class="accordionElContent">[ * ]</div></div>
                            </div>
                            <div id="collapse6" class="panel-collapse collapse">
                                <div class="tabbable-panel">
                                    <div class="tabbable-line">
                                        <ul class="nav nav-tabs">
                                            <li class="active"><a id="tabEvery_daysOfWeek" data-toggle="tab" href="#everyDayOfWeek" class="lang" as="everydayinweek"></a></li>
                                            <li><a id="tabSelected_daysOfWeek" data-toggle="tab" href="#selectedDayOfWeek" class="lang" as="dayinweek"></a></li>
                                        </ul>
                                        <div class="tab-content">
                                            <div id="everyDayOfWeek" class="tab-pane fade in active">
                                                <div class="settingsContainer text-center">
                                                    <div id="daysOfWeekText1" class="well well-sm settingsText">*</div>
                                                    <button id="everyUnit_daysOfWeek" type="button" class="btn btn-default btn-success lang" style="width:100%;" as="everydayinweek"></button>
                                                </div>
                                            </div>
                                            <div id="selectedDayOfWeek" class="tab-pane fade">
                                                <div class="settingsContainer">
                                                    <div id="daysOfWeekText3" class="well well-sm settingsText">12,13,15,48</div>
                                                    <div id="selectDaysOfWeek"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="two">
                <div id="scheduledDates" class="panel panel-primary">
                    <div class="panel-heading BoxTitleText"><span class="glyphicon glyphicon-time glyphIconTitle" aria-hidden="true"></span>
                    <span class="lang" as="timetable"></span></div>
                    <div class="panel-body cronExpressionBodyFix">
                        <ol id="triggerDateTimes" class="list-group daterow">
                            <li class="list-group-item">2017-03-01 17:58:33</li>
                            <li class="list-group-item">2017-03-01 17:58:33</li>
                            <li class="list-group-item">2017-03-01 17:58:33</li>
                        </ol>
                    </div>
                </div>
            </div>
        <section></section>
    </div>
    <div class="modal-footer">
        <button class="btn btn-primary lang" as="sure" data-dismiss="modal" onclick="cronmanager.saveCron();"></button>
        <button class="btn lang" as="cancel" data-dismiss="modal" aria-hidden="true"></button>
    </div>
    <!-- cron-editor-->
    <script type="text/javascript" src="~/Scripts/croneditor/script.js"></script>
    <script type="text/javascript">
        $(function () {
            kresource.localize();
        })
    </script>
</body>
</html>